import 'dart:convert';
import 'package:dio/dio.dart';
import 'package:flutter/material.dart';
import 'package:flutter_demo/widget/buttons.dart';
import 'package:flutter_demo/widget/tiny_widgets.dart';
import 'package:fluttertoast/fluttertoast.dart';
import 'http/api.dart';

class P_RegisterScreen extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _P_RegisterScreenState();
}

class _P_RegisterScreenState extends State<P_RegisterScreen> {

  late GlobalKey _formKey;
  late TextEditingController _accountController;
  late TextEditingController _pwdController;
  late TextEditingController _phoneController;

  @override
  void initState() {
    _formKey = GlobalKey<FormState>();
    _accountController = TextEditingController();
    _pwdController = TextEditingController();
    _phoneController = TextEditingController();
  }

  @override
  Widget build(BuildContext context) {

    var pAccount = Container(
      width: double.infinity,
      padding: EdgeInsets.symmetric(horizontal: 16),
      child: TextFormField(
        controller: _accountController,
        autofocus: true,
        decoration: const InputDecoration(
          labelText: '用户名',
          hintText: '您的用户名',
          border: InputBorder.none,
        ),
        style: TextStyle(
          fontSize: 14,
        ),
        validator: (value) {
          if (value!.trim().isEmpty) {
            return '用户名不能为空';
          } else if (value.trim().length > 10) {
            return '用户名超出最大长度';
          } else {
            return null;
          }
        },
      ),
      decoration: BoxDecoration(
        border: Border.all(color: Colors.black26, width: 1.0),
        borderRadius: BorderRadius.circular(5.0),
      ),
    );

    var pPassword = Container(
      width: double.infinity,
      padding: EdgeInsets.symmetric(horizontal: 16),
      child: TextFormField(
        controller: _pwdController,
        obscureText: true,
        decoration: const InputDecoration(
          labelText: '密码',
          hintText: '您的登录密码',
          border: InputBorder.none,
        ),
        style: TextStyle(
          fontSize: 14,
        ),
        validator: (value) {
          if (value!.trim().isEmpty) {
            return '密码不能为空';
          } else if (value.trim().length > 15) {
            return '密码超出最大长度';
          } else {
            return null;
          }
        },
      ),
      decoration: BoxDecoration(
        border: Border.all(color: Colors.black26, width: 1.0),
        borderRadius: BorderRadius.circular(5.0),
      ),
    );

    var phone = Container(
      width: double.infinity,
      padding: EdgeInsets.symmetric(horizontal: 16),
      child: TextFormField(
        controller: _phoneController,
        obscureText: true,
        decoration: const InputDecoration(
          labelText: '个人电话',
          hintText: '您的个人电话',
          border: InputBorder.none,
        ),
        style: TextStyle(
          fontSize: 14,
        ),
        validator: (value) {
          if (value!.trim().isEmpty) {
            return '个人电话不能为空';
          } else if (value.trim().length > 11) {
            return '个人电话超出最大长度';
          } else {
            return null;
          }
        },
      ),
      decoration: BoxDecoration(
        border: Border.all(color: Colors.black26, width: 1.0),
        borderRadius: BorderRadius.circular(5.0),
      ),
    );

    return Scaffold(
      body: Container(
        width: double.infinity,
        height: double.infinity,
        alignment: Alignment.topCenter,
        padding: EdgeInsets.only(
          top: 10,
        ),
        decoration: BoxDecoration(
          image: DecorationImage(
            image: NetworkImage(
              'http://my.gxrczc.com/assets/img/bg.png',
            ),
            fit: BoxFit.cover,
          ),
        ),
        child: Container(
          width: 822,
          decoration: BoxDecoration(
            color: Colors.white,
            border: Border.all(color: Colors.black26),
          ),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.stretch,
            mainAxisSize: MainAxisSize.min,
            children: [
              Container(
                width: 822,
                height: 63,
                child: Stack(
                  children: [
                    Positioned(
                      left: 0,
                      top: 0,
                      width: 120,
                      height: 32,
                      child: Container(
                        width: 120,
                        height: 32,
                        alignment: Alignment.center,
                        decoration: BoxDecoration(
                          color: Color(0xff1a56a8),
                        ),
                        child: Text(
                          '用户注册',
                          style: TextStyle(
                            color: Colors.white,
                            fontSize: 20,
                          ),
                        ),
                      ),
                    ),
                  ],
                ),
              ),
              Container(
                width: 822,
                height: 1,
                decoration: BoxDecoration(
                  color: Colors.black12,
                ),
              ),
              Container(
                width: 822,
                padding: EdgeInsets.all(10),
                child: Form(
                  key: _formKey,
                  autovalidateMode: AutovalidateMode.onUserInteraction,
                  child: Column(
                    mainAxisSize: MainAxisSize.min,
                    crossAxisAlignment: CrossAxisAlignment.stretch,
                    children: <Widget>[
                      C(8),
                      pAccount,
                      C(16),
                      pPassword,
                      C(16),
                      phone,
                      C(16),
                      Container(
                        width: double.infinity,
                        height: 34,
                        child: Stack(
                          children: [
                            Positioned(
                              left: 0,
                              top: 0,
                              width: 82,
                              height: 34,
                              child: BaseButton(
                                radius: 4,
                                buttonColor: Colors.white,
                                withBorder: true,
                                withShadow: false,
                                onTap: () => Navigator.pop(context),
                                child: Text(
                                  '返回登录',
                                  style: TextStyle(
                                    color: Color(0xff333333),
                                    fontSize: 14,
                                  ),
                                ),
                              ),
                            ),
                            Positioned(
                              right: 0,
                              top: 0,
                              width: 82,
                              height: 34,
                              child: BaseButton(
                                radius: 4,
                                buttonColor: Color(0xff337AB7),
                                withShadow: false,
                                onTap: () {
                                  if ((_formKey.currentState as FormState).validate())
                                    validatePassed(context);
                                },
                                child: Text(
                                  '创建用户',
                                  style: TextStyle(
                                    color: Colors.white,
                                    fontSize: 14,
                                  ),
                                ),
                              ),
                            ),
                          ],
                        ),
                      )
                    ],
                  ),
                ),
              )
            ],
          ),
        ),
      ),
    );
  }

  void validatePassed(BuildContext context) async {
    Response response = await SystemApi.p_register(
        _accountController.text,
        _pwdController.text,
        _phoneController.text);
    var map = json.decode(response.data);
    if (response.statusCode == 200 && map['code'] == '1') {
      Fluttertoast.showToast(msg: map['msg']);
      Navigator.pop(context);
    } else if (map['code'] != '1') {
      Fluttertoast.showToast(msg: map['msg']);
    } else {
      Fluttertoast.showToast(msg: response.statusCode.toString());
    }
  }
}